<ul nz-menu [nzMode]="'horizontal'" class="nav">
    <li nz-menu-item class="" routerLink="/tables/full" [routerLinkActive]="['ant-menu-item-selected']" style="outline: none">
        <a style="outline: none">专业管理</a>
    </li>
    <li nz-menu-item routerLink="/tables/standard" [routerLinkActive]="['ant-menu-item-selected']" style="outline: none">
        <a style="outline: none">教师管理</a>
    </li>
    <li nz-menu-item routerLink="/tables/student" [routerLinkActive]="['ant-menu-item-selected']" style="outline: none">
        <a style="outline: none">学生管理</a>
    </li>
</ul>
<div style="padding:15px 0">
    <nz-input [nzPlaceHolder]="'请输入您要搜索的教师姓名'" [(ngModel)]="_value" style="width: 300px;margin-right: 10px"></nz-input>
    <button nz-button [nzType]="'primary'" (click)="doSearch()">搜索</button>

    <button nz-button [nzType]="'primary'" style="float: right" (click)="addTeacher()">+新增老师</button>
</div>
<nz-table #nzTable [nzAjaxData]="data" [(nzPageIndex)]="pi" [(nzPageSize)]="ps" [nzLoading]="loading" [nzTotal]='Total' (nzDataChange)="dataChange($event)"
    (nzPageIndexChange)="pageChange($event)">

    <thead nz-thead>
        <tr>
            <!--<th nz-th [nzCheckbox]="true">-->
            <!--<label nz-checkbox [(ngModel)]="allChecked" [nzIndeterminate]="indeterminate"-->
            <!--(ngModelChange)="checkAll($event)"></label>-->
            <!--</th>-->
            <th nz-th>
                <span>用户姓名</span>
            </th>
            <th nz-th>
                <span>已关联专业</span>
            </th>
            <th nz-th>
                <span>已关联班级</span>
            </th>
            <th nz-th>
                <span>私有项目</span>
            </th>
            <th nz-th>
                <span>云项目</span>
            </th>
            <th nz-th>
                <span>课程</span>
            </th>
            <th nz-th>
                <span>操作</span>
            </th>
        </tr>
    </thead>
    <tbody nz-tbody>
        <tr nz-tbody-tr *ngFor="let data of nzTable.data">
            <!--<td nz-td [nzCheckbox]="true">-->
            <!--<label nz-checkbox  [(ngModel)]="i.checked" (ngModelChange)="refreshStatus($event)">-->
            <!--</label>-->
            <!--</td>-->
            <td nz-td>{{data.UserName}}</td>
            <td nz-td>
                <span (click)="showMajorModal(data)" style="cursor: pointer;color:#c00000">{{data.majorTotal}}</span>
            </td>
            <td nz-td>
                <span (click)="showTecModal(data)" style="cursor: pointer;color:#c00000">{{data.classTotal}}</span>
            </td>
            <td nz-td>{{data.projectTotal}}</td>
            <td nz-td>
                <span (click)="showCloudModal(data)" style="cursor: pointer;color:#c00000">{{data.cloudTotal}}</span>
            </td>
            <td nz-td>
                <span (click)="showCourseModal(data)" style="cursor: pointer;color:#c00000">{{data.courseTotal}}</span>
            </td>
            <td nz-td>
                <a (click)="edit(data)">修改</a>
                <span nz-table-divider></span>
                <a (click)="isDelTec(data)">删除</a>
            </td>
        </tr>
    </tbody>
</nz-table>

<nz-modal [nzWrapClassName]="'vertical-center-modal'" [nzFooter]="'true'" [nzVisible]="showClass" [nzTitle]="'关联专业'" [nzConfirmLoading]="loading"
    [nzContent]="mojorContent" (nzOnCancel)="clearMaj()" (nzOnOk)="saveMajor()" [nzStyle]="style" [nzOkText]="'确定'" [nzCancelText]="'取消'">
    <ng-template #mojorContent>
        <table cellspacing="0" cellpadding="0" border="0" width="100%">
            <tr>
                <td width="20%" align="right" height="50px">教师名称：</td>
                <td>{{tecName}}</td>
            </tr>
            <tr>
                <td align="right" height="50px">已关联专业：</td>
                <td>
                    <span style="padding:2px 5px;border:1px solid #ddd;margin-right:5px;cursor: default;margin-bottom: 10px;display: inline-block;"
                        *ngFor="let gl of glMajarr">{{ gl }}</span>
                </td>
            </tr>
            <tr>
                <td align="right" style="min-height: 50px">专业列表：</td>
                <td>
                    <ul style="border: 1px solid #ddd;max-height: 120px;overflow-y: auto;padding:10px;padding-bottom:0;width: 500px">
                        <li style="float:left;margin:0 20px 10px 10px" *ngFor="let major of majorList">
                            <input type="checkbox" id="{{'mid'+ major.maj_Id }}" style="vertical-align: middle;margin-right: 5px;" (change)="zyChange($event,major)"
                                [checked]="major.ischeck" />
                            <label for="{{'mid'+ major.maj_Id }}">{{major.major_name}}</label>
                        </li>

                    </ul>
                </td>
            </tr>
        </table>
    </ng-template>
</nz-modal>
<nz-modal [nzWrapClassName]="'vertical-center-modal'" [nzFooter]="'true'" [nzVisible]="showTec" [nzTitle]="'关联老师'" [nzConfirmLoading]="loading"
    [nzContent]="modalContent1" (nzOnCancel)="clearCla()" (nzOnOk)="saveClass()" [nzStyle]="style" [nzOkText]="'确定'" [nzCancelText]="'取消'">
    <ng-template #modalContent1>
        <table cellspacing="0" cellpadding="0" border="0" width="100%">
            <tr>
                <td width="20%" align="right" height="50px">专业名称：</td>
                <td>
                    <nz-select *ngIf="showTec" style="width: 300px;" [(ngModel)]="selectedOption" [nzPlaceHolder]="'--请选择专业--'" nzAllowClear
                        (ngModelChange)="selectMaj($event)">
                        <nz-option *ngFor="let option of selectList" [nzValue]="option.major_name" [nzLabel]="option.major_name">
                        </nz-option>
                    </nz-select>
                </td>
            </tr>
            <tr>
                <td align="right" height="50px">已关联班级：</td>
                <td>
                    <span style="padding:2px 5px;border:1px solid #ddd;margin-right:5px;cursor: default;margin-bottom: 10px;display: inline-block"
                        *ngFor="let cla of glClaArr">{{ cla }}</span>
                </td>
            </tr>
            <tr>
                <td align="right" style="min-height: 50px">班级列表：</td>
                <td>
                    <ul style="border: 1px solid #ddd;max-height: 120px;overflow-y: auto;padding:10px;padding-bottom:0;width: 500px">
                        <li style="float:left;margin:0 20px 10px 10px" *ngFor="let class of classList">
                            <input type="checkbox" id="{{'tid'+ class.cla_id }}" style="vertical-align: middle;margin-right: 5px;" (change)="clChange($event,class)"
                                [checked]="class.ischeck" />
                            <label for="{{'tid'+ class.cla_id }}">{{class.cla_name}}</label>
                        </li>

                    </ul>
                </td>
            </tr>
        </table>
    </ng-template>
</nz-modal>
<nz-modal [nzWrapClassName]="'vertical-center-modal'" [nzFooter]="'true'" [nzVisible]="addTecShow" [nzTitle]="teacTitle"
    [nzConfirmLoading]="loading" [nzContent]="modalContent2" (nzOnCancel)="clearAddTec()" (nzOnOk)="saveAddTec()" [nzStyle]="style"
    [nzOkText]="'确定'" [nzCancelText]="'取消'">
    <ng-template #modalContent2>
        <table cellspacing="0" cellpadding="0" border="0" width="100%">
            <tr>
                <td width="20%" align="right" height="50px">老师姓名：</td>
                <td>
                    <nz-input style="width:50%" [(ngModel)]="teacherName" [nzPlaceHolder]="'请输入老师姓名'"></nz-input>
                </td>
            </tr>
            <tr>
                <td align="right" height="50px">老师账号：</td>
                <td>
                    <nz-input style="width:50%" [(ngModel)]="teacherAccount" [nzPlaceHolder]="'请输入老师账号'"></nz-input>
                </td>
            </tr>
            <tr>
                <td align="right" height="50px">密码：</td>
                <td>
                    <nz-input style="width:50%" [(ngModel)]="passWord" [disabled]="true" [nzPlaceHolder]="'请输入老师密码'"></nz-input>
                </td>
            </tr>
            <tr>
                <td align="right" style="min-height: 50px">关联专业：</td>
                <td>
                    <button class="maj_btn" nz-button [nzType]="'default'" *ngFor="let maj of newMajName;let i = index" (click)="newShowClass(i)">
                        <span>{{ maj}}</span>
                    </button>
                    <ul style="border: 1px solid #ddd;max-height: 120px;overflow-y: auto;padding:10px;padding-bottom:0;width: 500px;margin-bottom:10px;">
                        <li style="float:left;margin:0 20px 10px 10px" *ngFor="let major of allMajList">
                            <input type="checkbox" id="{{'nmid'+ major.maj_Id }}" style="vertical-align: middle;margin-right: 5px;" (change)="zyNewChange($event,major)"
                                [checked]="major.ischeck" />
                            <label for="{{'nmid'+ major.maj_Id }}">{{major.major_name}}</label>
                        </li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td align="right" style="min-height: 50px">关联班级：</td>
                <td>
                    <button class="maj_btn" nz-button [nzType]="'default'" *ngFor="let cla of newClaName">
                        <span>{{ cla }}</span>
                    </button>
                    <ul style="border: 1px solid #ddd;max-height: 120px;overflow-y: auto;padding:10px;padding-bottom:0;width: 500px">
                        <li style="float:left;margin:0 20px 10px 10px" *ngFor="let class of allClaList">
                            <input type="checkbox" id="{{'ncid'+ class.cla_id }}" style="vertical-align: middle;margin-right: 5px;" (change)="clNewChange($event,class)"
                                [checked]="class.ischeck" />
                            <label for="{{'ncid'+ class.cla_id }}">{{class.cla_name}}</label>
                        </li>
                    </ul>
                </td>
            </tr>
        </table>
    </ng-template>
</nz-modal>
<nz-modal [nzWrapClassName]="'vertical-center-modal'" [nzFooter]="'true'" [nzVisible]="isRemove" [nzTitle]="'提示'" [nzContent]="removeContent"
    (nzOnCancel)="isRemove=false" (nzOnOk)="removeTec()" [nzStyle]="style1" [nzOkText]="'确定'" [nzCancelText]="'取消'">
    <ng-template #removeContent>
        <p>是否删除
            <b>{{ removeTeacName }}</b> 教师？</p>
    </ng-template>
</nz-modal>
<nz-modal [nzWrapClassName]="'vertical-center-modal'" [nzFooter]="'true'" [nzVisible]="cloubModal" [nzTitle]="'查看云项目'" [nzConfirmLoading]="loading"
    [nzContent]="cloubContent" (nzOnCancel)="cloubModal=false" (nzOnOk)="SaveTeacherCloud()" [nzStyle]="style" [nzOkText]="'确定'"
    [nzCancelText]="'取消'">
    <ng-template #cloubContent>

        <nz-table #nzTable [nzDataSource]="cloudList" [nzPageIndex]="cloubPage" [nzPageSize]="4" [nzTotal]="cloubTotal">
            <thead nz-thead>
                <tr>
                    <th nz-th width="15%">
                        是否关联
                    </th>
                    <th nz-th width="25%">
                        项目名称
                    </th>
                    <th nz-th>
                        项目描述
                    </th>
                </tr>
            </thead>
            <tbody nz-tbody>
                <tr nz-tbody-tr *ngFor="let list of nzTable.data">
                    <td nz-td>
                        <label nz-checkbox [(ngModel)]="list.isCheck" (ngModelChange)="cloudChange($event,list)">
                        </label>
                    </td>
                    <td nz-td>
                        {{ list.p_name}}
                    </td>
                    <td nz-td>
                        {{list.p_description}}
                    </td>
                </tr>
            </tbody>
        </nz-table>
    </ng-template>
</nz-modal>

<nz-modal [nzWrapClassName]="'vertical-center-modal'" [nzFooter]="'true'" [nzVisible]="courseModal" [nzTitle]="'查看课程'" [nzConfirmLoading]="loading"
    [nzContent]="courseContent" (nzOnCancel)="courseModal=false" (nzOnOk)="SaveTeacherCourse()" [nzStyle]="style" [nzOkText]="'确定'"
    [nzCancelText]="'取消'">
    <ng-template #courseContent>

        <nz-table #nzTable [nzDataSource]="courseList" [nzPageIndex]="cloubPage" [nzPageSize]="4" [nzTotal]="courseTotal">
            <thead nz-thead>
                <tr>
                    <th nz-th width="15%">
                        是否关联
                    </th>
                    <th nz-th width="25%">
                        课程名称
                    </th>
                </tr>
            </thead>
            <tbody nz-tbody>
                <tr nz-tbody-tr *ngFor="let list of nzTable.data">
                    <td nz-td>
                        <label nz-checkbox [(ngModel)]="list.isCheck" (ngModelChange)="courseChange($event,list)">
                        </label>
                    </td>
                    <td nz-td>
                        {{ list.cour_name}}
                    </td>
                </tr>
            </tbody>
        </nz-table>
    </ng-template>
</nz-modal>
